<script setup>
import section1 from './section1.vue'
import section2 from './section2.vue'
import section3 from './section3.vue'

const items = [
    {
        title: '「四月是你的谎言」',
        desc: '我在盛开的樱花下遇见你，从此命运不再属于自己。',
        image: new URL('@/project/assets/testpage.jpg', import.meta.url).href
    },
    {
        title: '「你的名字」',
        desc: '黄昏，不是白昼亦不是夜晚，是我努力却看不清你的脸。',
        image: new URL('@/project/assets/layout/section1_back.png', import.meta.url).href

    },
    {
        title: '「言叶之庭」',
        desc: '每晚临睡前 每天睁开眼的瞬间 不知不觉 我都在祈盼雨天 祈盼雨天 祈盼和那个人 再次相会',
        image: new URL('@/project/assets/layout/section4_back.webp', import.meta.url).href

    },
    {
        title: '「天气之子」',
        desc: '天气真的是很不可思议，光只是天空的模样就让人感动不已。',
        image: new URL('@/project/assets/testpage.jpg', import.meta.url).href

    }
]
</script>
<template>
    <div class="main-3">
        <section3 :items="items"></section3>
        <section1 :items="items"></section1>
        <section2 :items="items"></section2>
    </div>
</template>

<style lang="scss" scoped>
.main-3 {
    display: flex;
    flex-direction: column;
    gap: 36px;
}
</style>